import React, { useEffect, useState } from 'react';
import { Button, Input, Table, Space, Modal, Form } from 'antd'
import type { ColumnsType } from 'antd/es/table';
// import axios from 'axios';
interface Props {
    lossList: [],
    indexdatadelete: Function,
    dataupdata: Function,
    pagination: Object,
    handleChange: any
}
interface DataType {
    key: string;
    id: string;
    create_people: string,
    create_name: string;
    sun_type: string;
    sun_time: string;
    shen_people: string;
    shen_time: string;
    sun_reason: string;
    status: string;
}

function GetIntoList(props: Props) {
    const [form] = Form.useForm();
    const datadelete = (event: any) => {
        props.indexdatadelete(event)
    }
    const columns: ColumnsType<DataType> = [
        {
            title: '入库单号',
            dataIndex: 'danhao',
            // key: 'danhao',
        },
        {
            title: '入库人员',
            dataIndex: 'renyuan',
            // key: 'renyuan',
        },
        {
            title: '入库仓库',
            dataIndex: 'cangku',
            // key: 'cangku',
        },
        {
            title: '入库类型',
            dataIndex: 'cangku',
            // key: 'cangku',
        },
        {
            title: '创建入库单时间',
            dataIndex: 'time',
            // key: 'time',
        },
        {
            title: '审核人员',
            dataIndex: 'shenheren',
            // key: 'shenheren',
        },
        {
            title: '审核时间',
            dataIndex: 'shenhetime',
            // key: 'shenhetime',
        },
        {
            title: '状态',
            dataIndex: 'zhuangtai',
            // key: 'zhuangtai',
        },
        {
            title: '操作',
            key: '10',
            render: (_, record) => (
                <Space size="middle">
                    <a onClick={() => { datadelete(record) }}>删除</a>
                    <a onClick={() => { showModal_2(record) }} >编辑</a>
                    <a>详情</a>
                </Space>
            ),
        },
    ];

    //编辑
    var [isModalOpen_2, setIsModalOpen_2] = useState(false)
    // 编辑客服弹窗显示
    const showModal_2 = (text: any) => {
        setIsModalOpen_2(true);
        text = JSON.parse(JSON.stringify(text))
        console.log(text);
        form.setFieldsValue(text)

    };
    const handleCancel_2 = () => {
        setIsModalOpen_2(false);
    };
    // 编辑客服
    var onFinish_2 = (values: any) => {
        console.log('edit');
        props.dataupdata(values)
        setIsModalOpen_2(false);
        // staff_edit(values).then((res: any) => {
        //     if (res.data.code == 200) {
        //         message.success('更新成功');

        //         setIsModalOpen_2(false)
        //     } else {
        //         message.error('更新失败');
        //     }
        // })

    };
    return (
        <div>
            <Table
                columns={columns}
                dataSource={props.lossList}
                pagination={props.pagination}
                onChange={props.handleChange}
                className="table" />
            {/* 编辑弹窗 */}
            <Modal forceRender={true} title="编辑客服" footer={null} open={isModalOpen_2} onCancel={handleCancel_2}>
                <Form onFinish={onFinish_2} form={form}>
                    <Form.Item
                        name="id"
                        rules={[
                            {

                                required: true,
                                message: '请输入id!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入id" />
                    </Form.Item>
                    <Form.Item
                        name="cangku"
                        rules={[
                            {

                                required: true,
                                message: '请输入仓库!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入仓库" />
                    </Form.Item>

                    <Form.Item
                        name="danhao"
                        rules={[
                            {
                                required: true,
                                message: '请输入单号!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入单号" />
                    </Form.Item>

                    <Form.Item
                        name="renyuan"
                        rules={[
                            {
                                required: true,
                                message: '请输入人员!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入人员" />
                    </Form.Item>

                    <Form.Item
                        name="shenheren"
                        rules={[
                            {
                                required: true,
                                message: '请输入审核人!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入审核人" />
                    </Form.Item>
                    <Form.Item
                        name="shenhetime"
                        rules={[
                            {
                                required: true,
                                message: '请输入审核时间!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入审核时间" />
                    </Form.Item>
                    <Form.Item
                        name="time"
                        rules={[
                            {
                                required: true,
                                message: '请输入创建时间!',
                            },
                        ]}
                    >
                        <Input placeholder="请输入创建时间" />
                    </Form.Item>
                    <Form.Item
                        name="zhuangtai"
                        rules={[
                            {
                                required: true,
                                message: '更新状态',
                            },
                        ]}
                    >
                        <Input placeholder="更新状态" />
                    </Form.Item>
                    <Form.Item>
                        <Button block type="primary" htmlType="submit" shape="round">
                            确认更新
                        </Button>
                    </Form.Item>
                </Form>
            </Modal>

        </div>


    );
}

export default GetIntoList;